<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1, minimum-scale=1, user-scalable=no"
    />
    <title>订单详情</title>
    <link rel="stylesheet" type="text/css" href="../css/swiper.min.css" />
    <link rel="stylesheet" type="text/css" href="../css/dialog.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <script src="../js/flexible.js" type="text/javascript"></script>
    <script src="../js/swiper.min.js" type="text/javascript"></script>
    <script src="../js/zepto-v1.2.0.min.js" type="text/javascript"></script>
    <script src="../js/dialog.min.js" type="text/javascript"></script>
    <script src="../js/autosize.js" type="text/javascript"></script>
  </head>
  <body>
    <div class="order-detail-wrapper common-wrapper">
      <header class="header-wrapper clearfix">
        <div class="header-container white-background">
          <div class="left-container">
            <a class="back black-back" href="javascript:history.back(-1)"></a>
          </div>
          <span class="title">待付款订单</span>
        </div>
      </header>
      <div class="order-detail-container">
        <div class="order-info-wrapper">
          <section class="order-status-wrapper pending-pay">
            <span class="icon"></span>
            <div class="order-status-info">
              <div class="order-status-text">等待买家付款</div>
              <div class="order-status-desc">请于58分10秒内付款，超时订单将自动关闭</div>
            </div>
          </section>
          <section class="order-info-container">
            <div class="order-status-step-list">
              <div class="order-status-step-node">
                <div class="order-status-step-name">买家付款</div>
                <span class="checkbox checked"></span>
              </div>
              <div class="order-status-step-node">
                <div class="order-status-step-name">商家付款</div>
                <span class="checkbox"></span>
              </div>
              <div class="order-status-step-node">
                <div class="order-status-step-name">交易完成</div>
                <span class="checkbox"></span>
              </div>
            </div>
            <div class="address-container">
              <div class="address-info">
                <div class="user-info">
                  <label>收货人：</label>
                  <span class="name">黄晓明</label>&nbsp;
                  <span class="tel">18823217876</span>
                </div>
                <div class="address">
                  杭州市滨江区黄河街道长江小区34号楼5单元1201室
                </div>
              </div>
            </div>
          </section>
        </div>
        <section class="goods-list3">
          <div class="goods-item">
            <img src="../img/1x/goods-plane3.png" />
            <div class="goods-info">
              <div class="goods-name">
                商品名称商品名称商品名称商品名称 商品名称商品名称
              </div>
              <div class="goods-desc">DA-40型号</div>
            </div>
            <div class="order-info">
              <div class="price">￥320.00</div>
              <div class="count">X2</div>
            </div>
          </div>
          <div class="goods-item">
            <img src="../img/1x/goods-plane3.png" />
            <div class="goods-info">
              <div class="goods-name">
                商品名称商品名称商品名称商品名称 商品名称商品名称
              </div>
              <div class="goods-desc">DA-40型号</div>
            </div>
            <div class="order-info">
              <div class="price">￥320.00</div>
              <div class="count">X2</div>
            </div>
          </div>
          <div class="goods-item">
            <img src="../img/1x/goods-plane3.png" />
            <div class="goods-info">
              <div class="goods-name">
                商品名称商品名称商品名称商品名称 商品名称商品名称
              </div>
              <div class="goods-desc">DA-40型号</div>
            </div>
            <div class="order-info">
              <div class="price">￥320.00</div>
              <div class="count">X2</div>
            </div>
          </div>
          <div class="goods-item">
            <img src="../img/1x/goods-plane3.png" />
            <div class="goods-info">
              <div class="goods-name">
                商品名称商品名称商品名称商品名称 商品名称商品名称
              </div>
              <div class="goods-desc">DA-40型号</div>
            </div>
            <div class="order-info">
              <div class="price">￥320.00</div>
              <div class="count">X2</div>
            </div>
          </div>
          <div class="goods-item">
            <img src="../img/1x/goods-plane3.png" />
            <div class="goods-info">
              <div class="goods-name">
                商品名称商品名称商品名称商品名称 商品名称商品名称
              </div>
              <div class="goods-desc">DA-40型号</div>
            </div>
            <div class="order-info">
              <div class="price">￥320.00</div>
              <div class="count">X2</div>
            </div>
          </div>
          <div class="delivery info-item">
            <label>配送方式</label>
            <span class="info">
              快递物流
            </span>
          </div>
          <div class="remark info-item">
            <label>买家留言</label>
            <textarea placeholder="买家留言买家留言买家留言买家留言买家留言"></textarea>
          </div>
          <div class="amount-detail">
            <div class="amount-item">
              <label>商品金额</label>
              <span>￥960.00</span>
            </div>
            <div class="amount-item">
              <label>运费</label>
              <span>+￥10.00</span>
            </div>
            <div class="amount-item">
              <label>优惠</label>
              <span>-￥5.00</span>
            </div>
            <div class="amount-total">
              <label>合计：</label>
              <span>￥960.00</span>
            </div>
          </div>
        </section>
        <footer class="submit-bar">
          <div class="order-info">
            <span class="summary">
              合计：<span class="total"
                >¥<span class="amount">3218.50</span></span
              >
            </span>
          </div>
          <a class="normal-btn primary-btn submit-order" href="cashier.html?summary=3218.50">去支付</a>
        </footer>
      </span>
    </div>
  </body>
  <script src="../js/footerNav.js"></script>
  <script>
    $(document).ready(function () {
      const url_string = window.location.href
      const url = new URL(url_string)
      autosize($('textarea'));
      $('.submit-order').click(function () {
        const summary = $('.summary .amount').html()
        window.location.href = `cashier.html?summary=${summary}`
      })
    })
  </script>
</html>
